<?php
$this->title='speaking';
use \yii\helpers\HtmlPurifier;
$this->registerJSFile('@web/js/speakmore.js',['depends'=>['app\assets\AppAsset']]);
$this->registerJSFile('@web/js/savenote.js',['depends'=>['app\assets\AppAsset']]);
$this->registerJSFile('@web/js/count.js',['depends'=>['app\assets\AppAsset']]);
$this->registerCssFile('@web/css/note.css',['depends'=>['app\assets\AppAsset']]);

?>
<form action="?r=speaking/<?=$action;?>" id="nextque" method="post">
    <input type="hidden" name="page" value="<?=$page;?>">
    <input name="_csrf" type="hidden" id="_csrf" value="<?= Yii::$app->request->csrfToken ?>">
    <input name="usercheck" type="hidden" value="">
    <input type="hidden" name="post_type" value="">
    <input type="hidden" name="total-views1" value="">
    <input type="hidden" name="first-view1" value="">
    <input type="hidden" name="second-view1" value="">
</form>
<script>
    <?php
    $session = \Yii::$app->session;
    $session->open();
    $session['form']=4;
    ?>
    isKey=<?=$session['practice'];?>;
    window.onload = function () {
        // 如果是非方法练习，左侧无法输入


        if (!isKey) {
            $(".add-note").remove();
            $(".form-control").prop("disabled",true);
        }


        var $submit_time=$("[name=post_type]").clone(true).attr("name","time");
        $submit_time.appendTo("#nextque");
        var t=0;
        //计时
        $.ajax({
            url: "?r=ajax/gettime&state=<?=$state;?>&token=<?=$token;?>",
            dataType: 'json',
            type: 'get',
            success: function (data) {
                var $time=$("i.fa-clock-o");
                var sec=data.time;          //初始时间，以秒为单位
                setInterval(
                    function(){
                        sec++;
                        t++;
                        $time.html(secToMin(sec));
                        $submit_time.val(t);
                    },1000);
            }
        });

        if(isKey){
            var timeCount=new countTime({
                parent:"time-count",
                alert:"已经45秒钟了哦",
                count:45
            });
            timeCount.init();
        }else{
            $("#time-count").remove();
        }

    };
</script>
<div class="container">
    <div class="leadx row clearfix">
        <div class="col-xs-3 pull-left">
            <span>
                Part
                <?=$speak_content['question_number'];
                ?>
                speaking
                Passage
                <?=$page-1;?>
                of
                <?=$speak_content['hear_number'];?>
            </span>
        </div>
        <div class="col-xs-1 pull-left notebook">
            <a href="#"><span><i class="fa fa-pencil-square-o"></i> 笔记</span></a>
        </div>
        <div class="col-xs-1 pull-right">
            <span><i class="fa fa-clock-o"></i></span>
        </div>
    </div>
    <div class="speak-wrap">
        <div class="speak-info row">
            Question
            <?=$speak_content['question_number']?>
            of
            6
        </div>
        <div class="col-xs-5 speak-spe">
            <div class="speak-que">
                <div class="que clearfix">
                    <div class="pull-left">请下表根据右侧文章完成</div>
                    <div class="pull-right" id="time-count"></div>
                </div>
                <form class="form form-horizontal">
                    <div class="form-group">
                        <label for="total-views" class="sr-only control-label" ></label>
                        <div class="col-xs-12">
                            <input type="text" class="form-control" id="total-views" placeholder="本文主题">
                        </div>
                        <div class="remove"><i class="fa fa-times"></i></div>
                    </div>
                    <div class="form-group">
                        <label for="first-view" class="col-xs-1 control-label"><span>1.</span></label>
                        <div class="col-xs-11">
                            <input type="text" class="form-control" id="first-view" placeholder="第一方面">
                        </div>
                        <div class="remove"><i class="fa fa-times"></i></div>
                    </div>
                    <div class="form-group">
                        <label for="second-view" class="col-xs-1 control-label"><span>2.</span></label>
                        <div class="col-xs-11">
                            <input type="text" class="form-control" id="second-view" placeholder="第二方面">
                        </div>
                        <div class="remove"><i class="fa fa-times"></i></div>
                    </div>
                </form>
            </div>
        </div>
        <div class="col-xs-7 speak-text">
            <?=$speak_content['reading_content'];?></div>
    </div>
</div>
<div class="add-note hidden">
    <div class="row">
        <div class="col-xs-7 text-note"></div>
        <div class="col-xs-5 add-note-text">+加到笔记</div>
    </div>
    <div class="row addtoleft">
        <div class="col-xs-8 add-left">+添加到左侧答案栏</div>
    </div>
</div>
<div class="addnote">
    <div class="note-lead">
        <span id="note-word">笔记</span>
        <span class="close"><i class="fa fa-times"></i></span>
    </div>
    <div class="note-text">
        <div contenteditable="true" id="note-self"><?=HtmlPurifier::process($my_note['note']);?></div>
    </div>
    <form action="#" id="note-form">
        <button type="button" name="note-save" id="note-submit">Save and Close</button>
        <input type="hidden" name="saved-note" value="">
    </form>
</div>
